<template>
  <div>
    <el-card style="width:40%;margin: 10px;height: 500px">
      <el-form ref="form" :model="form" label-width="100px">
        <el-form-item label="申请人">
          <el-input v-model="form.coachName"></el-input>
        </el-form-item>
        <el-form-item label="请假类型">
          <el-radio v-model="form.leaveType" label="事假">事假</el-radio>
          <el-radio v-model="form.leaveType" label="病假">病假</el-radio>
          <el-radio v-model="form.leaveType" label="年假">年假</el-radio>
          <el-radio v-model="form.leaveType" label="婚假">婚假</el-radio>
          <el-radio v-model="form.leaveType" label="丧假">丧假</el-radio>
          <el-radio v-model="form.leaveType" label="调休">调休</el-radio>
          <el-radio v-model="form.leaveType" label="产假">产假</el-radio>
          <el-radio v-model="form.leaveType" label="陪产假">陪产假</el-radio>
        </el-form-item>
        <el-form-item label="开始时间">
<!--          <el-date-picker-->
<!--              v-model="value1"-->
<!--              type="datetime"-->
<!--              placeholder="选择日期时间">-->
<!--          </el-date-picker>-->
          <el-date-picker type="datetime" placeholder="选择开始时间"
                           v-model="form.startDate" @change="formatStartTime"></el-date-picker>
        </el-form-item>
        <el-form-item label="结束时间">
          <el-date-picker type="datetime" placeholder="选择开始时间"  v-model="form.endDate" @change="formatStartTime1"></el-date-picker>
        </el-form-item>
        <el-form-item label="总共请假天数">
          <el-input v-model="form.leaveDay"></el-input>
        </el-form-item>
        <el-form-item label="请假原因">
          <el-input type="textarea" v-model="form.reason"></el-input>
        </el-form-item>
      </el-form>
      <div style="text-align: center">
        <el-button type="primary" @click="update" style="margin-top: 35px">申请</el-button>
      </div>
    </el-card>
  </div>
</template>

<script>
import request from "@/utils/request";

export default {
  name: "Person",
  data(){
    return{
      form:{},
      userName:'',
      time1:'',
      time2:''
    }
  },
  created() {
    let str = sessionStorage.getItem("coach") || "{}";
    // this.form = JSON.parse(str);
    console.log(JSON.parse(str))
    this.form.coachName=JSON.parse(str).userName
    this.form.coachId=JSON.parse(str).id
    this.form.status=0
  },
  methods:{
    formatStartTime(val){
      this.form.startDate = this.timeStr(val)
      this.time1=val
    },
    formatStartTime1(val){
      this.form.endDate = this.timeStr(val)
      this.time2=val
      this.form.leaveDay=this.DateDiff(this.time1,this.time2)
    },
    timeStr(dataStr){
      var date = new Date(dataStr);
      var y = date.getFullYear();

      var m = date.getMonth() + 1;
      m = m < 10 ? ('0' + m) : m;

      var d = date.getDate();
      d = d < 10 ? ('0' + d) : d;

      var h = date.getHours();
      h = h < 10 ? ('0' + h) : h;

      //获得分
      var mm = date.getMinutes()
      mm = mm < 10 ? ('0' + mm) : mm;

      //获得秒
      var ss = date.getSeconds()
      ss = ss < 10 ? ('0' + ss) : ss;

      return y+'-'+m+'-'+d+' '+h+':'+mm+':'+ss
    },
    update(){

      request.post("/api/leave",this.form).then(res => {
        console.log(res);
        if (res.code === '0'){
          this.$message({
            type:"success",
            message:"申请成功"
          })
          // sessionStorage.setItem("member",JSON.stringify(this.form));
          this.form={};
        }else {
          this.$message({
            type:"error",
            message:res.msg
          });
        }
      });
    },
    DateDiff(beginTime, endTime){
      // console.log(this.form.endTime.getTime())
      var dateDiff = endTime.getTime() - beginTime.getTime(); //时间差的毫秒数
      var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000)); //计算出相差天数
      var leave1 = dateDiff % (24 * 3600 * 1000); //计算天数后剩余的毫秒数
      var hours = Math.floor(leave1 / (3600 * 1000)); //计算出小时数
      //计算相差分钟数
      var leave2 = leave1 % (3600 * 1000); //计算小时数后剩余的毫秒数
      var minutes = Math.floor(leave2 / (60 * 1000)); //计算相差分钟数
      return  dayDiff + "天 " + hours + "小时 " + minutes + " 分钟"
    },

  }
}
</script>

<style scoped>

</style>
